<template>
	<div class="footer">
		<div class="line"></div>
		<div class="title"><span>票面价</span>是指通过景区指定窗口售卖的纸质门票上标注的价格</div>
		<div class="box">
			<div class="classify">
				<div><span class="iconfont">&#xe62a;</span><a href="#">机票</a></div>
				<div><span class="iconfont">&#xe606;</span><a href="#">酒店</a></div>
				<div><span class="iconfont">&#xe618;</span><a href="#">公寓</a></div>
				<div><span class="iconfont">&#xe64c;</span><a href="#">更多</a></div>
			</div>
			<div class="about">
				<span>登录</span>
				<span>我的订单</span>
				<span>最近浏览</span>
				<span>关于我们</span>
			</div>
			<div class="version">
				<div>触屏版</div>
				<div>电脑版</div>
			</div>
			<div class="last">Qunar 京ICP备05021087 意见反馈</div>
		</div>
	</div>
</template>
<script>
	export default{
		name:"Footer",
		data(){
			return {
				
			}
		}
	}
</script>

<style lang="stylus" scoped>
	.footer .line{
		width:100%;
		height:0.07rem;
		background:#eaeaea;
	}
	.title{
		width:100%;
		text-align:center;
		height:0.3rem;
		line-height:0.3rem;
		color:#616161;
	}
	.title span{color:#333 !important;}
	.box{background:#F3F3F3;}
	.classify{display:flex;color:#9E9E9E;margin:0.05rem 0rem;}
	.classify div{text-align:center;width:25%;}
	.classify div a{color:#9E9E9E;text-decoration:underline;}
	.classify div:nth-of-type(3){border-right:1px solid #9E9E9E;}
	.about{
		display:flex;height:0.4rem;line-height:0.4rem;
		border-bottom:1px solid #ccc;
	}
	.about span{width:25%;
			text-align:center;
			color:#25A4BB;
		}
	.version{
		display:flex;
		height:0.3rem;
		line-height:0.3rem;
	}
	.version div:nth-of-type(1){
		text-align:right;
		width:50%;
		padding:0 0.3rem;
	}
	.version div:nth-of-type(2){
		text-align:left;
		color:#25A4BB;
		width:50%;
		padding:0 0.3rem;
	}
	.last{
		text-align:center;
		color:#616161;
		padding-bottom:0.1rem;
	}
</style>